import {createStore} from 'vuex';
import axios from 'axios'
import {ref} from 'vue'

const event = {
    namespaced: true,
    state: {
        id: 1, // store.event.id
        title: '',
        body: '',
        page: 1,
        perPage: 5,
        currentevents: [],
        eventsTotal: 0,
    },
    actions: {
        fetchEvents(ctx, payload) { // dispatch('event/fetchEvent')
            const params = {}
            params.page = ctx.state.page
            params._limit = ctx.state.perPage
            console.log(payload)
            return axios.get(`/events/`, {params}).then(res => {
                ctx.state.eventsTotal = res.headers['x-total-count'] || ctx.state.page
                const data = res.data
                ctx.state.currentevents = data;
            })
        },
        fetchEvent(ctx, id) { // dispatch('event/fetchEvent')
            return axios.get(`/events/${id}`).then(res => {
                ctx.state.id = res.data.id
                ctx.state.title = res.data.title
                ctx.state.body = res.data.body
            })
                // .catch(error => {
                    // const notification = {
                    //     type: 'error',
                    //     message: 'There was a error'
                    // }
                    // dispatch('notification/add', notification, {root: true})
                // });
        },
        createEvent(ctx, payload) {
            console.log(payload)
        },

    }
}
export default createStore({
    modules: {event},

});
